<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib uri="/struts-tags" prefix="s"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Ace Armor</title>
<link rel="stylesheet" href="views/css/loginScreen.css" type="text/css" media="screen" title="default" />
<link rel="stylesheet" href="views/css/colorbox.css" type="text/css" media="screen" title="default" />

<!--  jquery core -->
<script src="views/js/jquery/jquery-1.4.1.min.js" type="text/javascript"></script>


<!-- Custom jquery scripts -->
<script src="views/js/jquery/custom_jquery.js" type="text/javascript"></script>

<!-- MUST BE THE LAST SCRIPT IN <HEAD></HEAD></HEAD> png fix -->
<script src="views/js/jquery/jquery.pngFix.pack.js" type="text/javascript"></script>

<script src="views/js/login.js" type="text/javascript"></script>
<script src="views/js/jquery.colorbox.js" type="text/javascript"></script>

<script type="text/javascript">
$(document).ready(function(){
	//$('div#display').hide();
	//$('div#display').animate({"height": "toggle"}, { duration: 1000 });	
	//$('div#footer').hide();
	$(document).pngFix( );
	//$.colorbox.init();
	
	//$.fn.colorbox({width:"580", height:"362",iframe:true,open:true});
	$.colorbox({ open: true, inline:true,href:"#login-holder", width:"580", height:"362",escKey:false,overlayClose:false,fastIframe:false});
	//$.colorbox.init()
	
});
</script>
<!--<s:include value="include.jsp" />-->
</head>
<body>
<div class="iframe">
<s:actionerror />
<s:form method="post" theme="simple" id="loginPage">
<s:hidden id="loginattempt" name="LOGIN_ATTEMPT" value="%{'1'}" /><h>

<!-- Start: login-holder -->
<div id="login-holder">

	<!-- start logo -->
	<div id="logo-login">
		<!--<a href="index.html"><img src="views/images/shared/logo.png" width="156" height="40" alt="" /></a>-->
	</div>
	<!-- end logo -->
	
	
	
	<!--  start loginbox ................................................................................. -->
	<div id="loginbox">
	
	<!--  start login-inner -->
	<div id="login-inner">
		<table>
		<tr>
			<th>Username</th>
			<td><s:textfield name="username" id="username" cssClass="login-inp" /></td>
		</tr>
		<tr>
			<th>Password</th>
			<td><s:password name="password" id="password" value="************"  onfocus="this.value=''" cssClass="login-inp" /></td>
		</tr>
		<tr>
			<th></th>
			<td valign="top"><input type="checkbox" class="checkbox-size" id="login-check" /><label for="login-check">Remember me</label></td>
		</tr>
		<tr>
			<th></th>
			<td><input type="button" class="submit-login" /></td>
<!--			<td><input type="button" class="cancel" onclick="" /></td>-->
		</tr>
		</table>
	</div>
		<!--  end login-inner -->
	<div class="clear"></div>
	<a href="#" class="forgot-pwd">Forgot Password?</a>
 </div>
 <!--  end loginbox -->
 
	<!--  start forgotbox ................................................................................... -->
	<div id="forgotbox">
		<div id="forgotbox-text">Please send us your email and we'll reset your password.</div>
		<!--  start forgot-inner -->
		<div id="forgot-inner">
		<table border="0" cellpadding="0" cellspacing="0">
		<tr>
			<th>Email address:</th>
			<td><input type="text" value=""   class="login-inp" /></td>
		</tr>
		<tr>
			<th> </th>
			<td><input type="button" class="submit-login"  /></td>
		</tr>
		</table>
		</div>
		<!--  end forgot-inner -->
		<div class="clear"></div>
		<a href="" class="back-login">Back to login</a>
	</div>
	<!--  end forgotbox -->
</div>
<!-- End: login-holder -->

</s:form>
</div>
</body>
</html>